import { useState } from 'react'
import './App.css';
import State from './components/State';
import Effect from './components/Effect';
import ContextCom from './components/ContextCom';
import Reduer from './components/Reduer';
import MyHook from './components/MyHook';

// 类组件  有自己内部的状态   有生命周期
// 函数式组件

function App() {
  const [flag, setFlag] = useState(true)
  return (
    <div className="App">
      {/* <button onClick={() => {
        setFlag(!flag)
      }}>显示隐藏</button>
      <State/>
      { flag? <Effect/>: ''} */}

      {/* <ContextCom/> */}

      {/* <Reduer/> */}

      {/* 自定义hook -- hoc */}
      {/* <MyHook/> */}
      <State/>
      
    </div>
  );
}

export default App;
